---
import { type CollectionEntry, getCollection } from "astro:content";
import Base from "@layouts/Base.astro";
import BlogCard from "@components/BlogCard.astro";
import SimplePostList from "@components/templates/SimplePostList.astro";

type Props = { posts: CollectionEntry<"blog">[] };

export async function getStaticPaths() {
  const posts = await getCollection("blog");
  const keywords = [
    ...new Set(
      await getCollection("blog").then((x) =>
        x.flatMap((x) => x.data.keywords)
      ),
    ).values(),
  ];
  return keywords.map((k) => ({
    params: { keyword: k },
    props: {
      posts: posts.filter((post) =>
        post.data.keywords.some((i) => i.localeCompare(k) === 0)
      ),
    },
  }));
}

const title = `Blogue &ndash; ${Astro.params.keyword}`;
const description = `Últimas postagens da categoria ${Astro.params.keyword}.`;

const posts = Astro.props.posts.sort((a, b) =>
  new Date(b.data.dateCreated).valueOf() -
  new Date(a.data.dateCreated).valueOf()
);
---

<Base {title} {description}>
  <main
    itemprop="mainContentOfPage"
    itemscope
    itemtype="https://schema.org/WebPageElement"
  >
    <section
      id="posts"
      itemprop="citation"
      itemscope
      itemtype="http://schema.org/Blog"
    >
      <h2 itemprop="name description" set:html={title} />
      <SimplePostList
        {posts}
        dateOptions={{
          weekday: "long",
          year: "numeric",
          month: "long",
          day: "numeric",
          hour: "2-digit",
          minute: "2-digit",
          timeZoneName: "long",
        }}
      />
    </section>
  </main>
</Base>